﻿/**对话框类
* @author hwz 200-07-07
*/
var _maskManagerInit_ = false; //用于实现单例的遮罩层管理
var _messageBoxInit_ = false; //用于实现单例的MessageBox
function $M(id) {
    return document.getElementById(id);
}
//获取不重复的ID
function _getUniqueId_(id) {
    if (!$M(id)) {
        return id;
    }
    else {
        for (var i = 0; true; i++) {
            if (!$M(id + i)) {
                return id + i;
            }
        }
    }
}
//遮罩层管理
function MaskManager() {
    if (_maskManagerInit_) {//单例
        return _maskManager_;
    }
    this.init = false;
    this.onShow = false;
    this.ele = null; //遮罩层里边需要显示的元素
    this.id = '';
    this.containerId = '';
    this.width; //ele的宽度
    this.height; //ele的高度
    this.create = function() {//创建遮罩层容器
        if (this.init) {
            return;
        }
        this.id = _getUniqueId_('msgDiv');
        this.containerId = _getUniqueId_('containerDiv');
        var container = document.createElement('div');
        container.id = this.id;
        with (container.style) {
            display = "none";
            position = "absolute";
            left = "0";
            top = "0";
            zIndex = "127";
            overflow = 'hidden'; //为后续实现拖曳对话框，提供更严谨的环境
            border = 'none';
            margin = '0';
            padding = '0';
        }
        container.innerHTML = "<iframe style='position: absolute; z-index: -1; width: 100%; height: 100%;left:0;top:0;filter:chroma(color=#ffffff);' frameborder='0 ' src='about:blank '></iframe>\
                               <div style='z-index:0;height:100%;width:100%;background-color:#369;opacity:0.5;filter:alpha(opacity=50);background:#000000 none repeat scroll 0 0;-moz-opacity:0.5;'></div>\
                               <div id='" + this.containerId + "' style='position: absolute;z-index:1;height:100%;width:100%;left:0;top:0;overflow:hidden;'></div>";
        document.body.appendChild(container);
        this.init = true;
    }
    this.setContent = function(maskLayer) {//设置要显示的内容
        if (!this.init) {
            this.create();
        }
        for (var i = $M(this.containerId).childNodes.length; i > 0; ) {
            i--;
            $M(this.containerId).removeChild($M(this.containerId).childNodes[i]);
        }
        var par = maskLayer.ele.parentNode;
        if (par) {//要显示于遮罩层中的元素不能别其他元素占有
            par.removeChild(maskLayer.ele);
        }
        maskLayer.ele.style.position = 'absolute';
        maskLayer.ele.style.display = 'block';
        maskLayer.ele.style.visibility = 'visible';
        this.width = isNaN(parseInt(maskLayer.ele.width)) ? maskLayer.width : parseInt(maskLayer.ele.style.width);
        this.height = isNaN(parseInt(maskLayer.ele.height)) ? maskLayer.height : parseInt(maskLayer.ele.height);
        $M(this.containerId).appendChild(maskLayer.ele);
        this.ele = maskLayer.ele;
    }
    this.show = function(maskLayer) {//显示
        this.setContent(maskLayer);
        if (!this.init) {
            this.create();
        }
        this.resize();
        $M(this.id).style.display = 'block';
        $M(this.id).style.visibility = 'visible';
    }
    this.hide = function() {//隐藏
        if (this.init) {
            if ($M(this.id)) {
                $M(this.id).style.display = 'none';
                $M(this.id).style.visibility = 'hidden';
            }
        }
    }
    this.resize = function() {//重定义尺寸
        if (_maskManager_.init) {
            var con = $M(_maskManager_.id);
            if (con) {
                con.style.width = document.body.clientWidth > document.body.scrollWidth ? document.body.clientWidth + "px" : document.body.scrollWidth + "px";
                con.style.height = document.body.clientHeight > window.screen.availHeight ? document.body.clientHeight + "px" : window.screen.availHeight + "px";
            }
            //_maskManager_.resetlocation();
        }
    }
    this.resetlocation = function() {
        var doc = (document.compatMode && document.compatMode == 'CSS1Compat') ? document.documentElement : document.body;
        _maskManager_.ele.style.left = doc.scrollLeft + (doc.clientWidth - _maskManager_.width) / 2 + "px";
        _maskManager_.ele.style.top = doc.scrollTop + (doc.clientHeight - _maskManager_.height) / 2 + "px";
    }
    _maskManagerInit_ = true;
    return this;
}
var _maskManager_ = new MaskManager();
/*window.onresize = function() {
    if (_maskManager_) {
        _maskManager_.resize();
    }
}*/
//遮罩层类
function MaskLayer() {
    this.ele = null; //需要显示的元素
    this.width = 400;
    this.height = 300;
    this.setContent = function(ele, width, height) {
        this.ele = ele;
        if (arguments.length == 3) {
            this.width = width;
            this.height = height;
        }
        _maskManager_.setContent(this);
    }
    this.show = function() {//显示
        _maskManager_.show(this);
    }
    this.hide = function() {//隐藏
        _maskManager_.hide();
    }
    this.showIframe = function(url, left, top) {
        var ele = document.createElement('div');
        ele.style.width = '100%';
        ele.style.height = '100%';
        ele.style.margin = '0';
        ele.style.border = '0';
        ele.innerHTML = '<iframe style="position:absolute;z-index:100;width:100%;height:100%;left:' + left + 'px;top:' + top + 'px;" frameborder="0" src="' + url + '"></iframe>';
        this.setContent(ele);
        //var ifr = document.createElement('<iframe style="position:absolute;z-index:100;width:100%;height:100%;left:' + left + 'px;top:' + top + 'px;" frameborder="0" src="' + url + '"></iframe>');
        //this.setContent(ifr);
        this.show();
    }
    return this;
}

function MessageBox() {
    if (_messageBoxInit_) {
        return Msg;
    }
    this.init = false;
    //this.id = '';//整个对话框容器id
    this.textId = ''; //对话款内容id
    this.titleId = ''; //标题栏id
    this.boxId = ''; //对话框id
    this.closeBackCall = null; //关闭对话框时调用的函数
    this.okBackCall = null; //按下“确定”按钮时调用的函数
    this.maskLayer = new MaskLayer();
    //关闭对话框
    this.close = function() {
        if (Msg) {
            if ($M(Msg.id)) {
                Msg.maskLayer.hide();
            }
            if (Msg.closeBackCall) {
                Msg.closeBackCall();
                Msg.closeBackCall = null;
            }
        }
    };
    //按下“确定”按钮
    this.ok = function() {
        if (Msg) {
            if ($M(Msg.id)) {
                Msg.maskLayer.hide();
            }
            if (Msg.okBackCall) {
                Msg.okBackCall();
                Msg.okBackCall = null;
            }
        }
    };
    this.create = function() {//创建对话框Display
        //设置id
        _maskManager_.create();
        this.id = _maskManager_.id;
        this.textId = _getUniqueId_('msgText');
        this.titleId = _getUniqueId_('msgTitle');
        this.boxId = _getUniqueId_('msgBox');
        this.maskLayer.id = this.id;
        var msgBx = document.createElement('div');
        msgBx.id = this.boxId;
        with (msgBx.style) {
            width = '400px';
            height = 'auto';
            position = 'absolute';
            left = '400px';
            top = '300px';
            backgroundColor = '#FFF';
            border = '2px solid #C1C1C1';
        }
        msgBx.innerHTML = "<div id='msgHeader' style='width:100%;height:29px;line-height:29px'>\
                    <div style='padding:0 5%;float:left;'>\
                        <div style=''>\
                            <div id='msgTitle' style='font-size:14px;font-weight:bold;overflow:hidden;'>\
                                提示\
                            </div>\
                        </div>\
                    </div>\
                    <div style='padding:0 5%;float:right;'>\
                        <div style=''>\
                            <div onclick='javascript:Msg.close();' style='font-size:12px;color:#97d326;cursor:pointer;'>\
                                关闭X\
                            </div>\
                        </div>\
                    </div>\
                </div>\
                <div style='width:90%;height:1px;padding:0 5%;overflow:hidden;'>\
                    <div style='width:100%;height:1px;background:transparent url(../img/point.gif) repeat-x scroll; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;'>\
                    </div>\
                </div>\
                <div style='padding:30px 5%;width:90%;height:auto;'>\
                    <div id='msgText' style='line-height:30px;text-align:center;font-size:14px'>\
                        注册成功！马上进入会员中心。\
                    </div>\
                </div>\
                <div onclick='javascript:Msg.ok();' style='margin:10px auto;width:50px;height:30px;line-height:30px;background:url(../img/bt2.gif) no-repeat center center;color:#4A4A4A;font-size:12px;text-align:center;cursor:pointer;'>\
                    确定\
                </div>";
        this.maskLayer.setContent(msgBx, 400, 200);
        this.init = true; //表示用于显示的元素已经创建
    }
    //显示遮罩层对话框，实现多种重载，主要有show(text),show(text,title)，show(text,okBackCall)，show(text,okBackCall,closeBackCall),show(text,title,okBackCall,closeBackCall),
    this.show = function(text, title, okBackCall, closeBackCall) {
        if (!this.init) {//不存在遮罩层对象，则重新创建
            this.create();
        }
        //显示遮罩层
        this.maskLayer.show();
        if ($M(this.titleId)) {
            $M(this.titleId).innerHTML = '';
        }
        if ($M(this.textId)) {
            $M(this.textId).innerHTML = '';
        }
        this.closeBackCall = null;
        this.okBackCall = null;
        //实现重载        
        if (arguments.length > 0) {
            if (typeof (arguments[0]) == 'string') {//消息的内容
                if ($M(this.textId)) {
                    $M(this.textId).innerHTML = arguments[0];
                }
            }
            if (arguments.length > 1) {
                if (typeof (arguments[1]) == 'string') {//有标题
                    if (arguments[1].length > 20) {//标题长度过长
                        if ($M(this.titleId)) {
                            $M(this.titleId).innerHTML = arguments[1].toString().substr(0, 20);
                        }
                    }
                    else {
                        if ($M(this.titleId)) {
                            $M(this.titleId).innerHTML = arguments[1];
                        }
                    }
                }
                else {//无标题
                    if (typeof (arguments[1]) == 'function') {
                        this.okBackCall = arguments[1];
                    }
                }
                if (arguments.length > 2) {
                    if (typeof (arguments[2]) == 'function') {
                        if (this.okBackCall) {
                            this.closeBackCall = arguments[2];
                        }
                        else {
                            this.okBackCall = arguments[2];
                        }
                    }
                    if (arguments.length > 3) {
                        if (typeof (arguments[3]) == 'function') {
                            if (!this.closeBackCall) {
                                this.closeBackCall = arguments[3];
                            }
                        }
                    }
                }
            }
        }
    }
    _messageBoxInit_ = true;
    return this;
}
var Msg = new MessageBox(); //公用MessageBox

var iframeLayer = new MaskLayer();